<template>
	<div>
		<h1>个人信息</h1>
		{{ $route.params.id }}
		<hr>
		<span>这里是props的id : {{ id }}</span>
	</div>
</template>

<script>
export default {
	props: ['id'],
	name: "Profile",
	// 过滤器 chain      hook 函数
	beforeRouteEnter (to, from, next) {
		console.log("进入路由之前");  // 加载数据
		next(vm => {
			vm.getData(); // 进入之前去执行这个getData方法;
		});
	},
	beforeRouteLeave (to, from, next) {
		console.log("离开路由之后")
		next();
	},
	methods:{
		getData: function(){
			this.axios({
				method: "get",
				url:"https://localhost:5173/mock/data.json",
			}).then((response) => {
				console.log(response);
			}).catch((error) =>{
				console.log(error);
			})
		}
	}
}
</script>

<style scoped>

</style>